<template>
  <div id="app">
    <!-- <img src="./assets/logo.png"> -->
    <!-- <h2>{{currentPage}}</h2> -->
    <!-- <div>我是顶部导航栏对应的组件</div>
    <div>我是侧边栏栏对应的组件</div> -->
    <div>
      <input type="text" placeholder="你要查谁的手机号?" v-model="name">
      <button @click="getPhone">查询</button>
    </div>
    <router-view/>
    <!-- <pagination @change-page="changeHandler"></pagination>
    <i class="el-icon-coffee-cup"></i>
    <i class="el-icon-coffee-cup"></i>
    <i class="el-icon-coffee-cup"></i> -->
  </div>
</template>

<script>
import axios from 'axios'
import hello from './components/HelloWorld'
import pagination from './components/page'

export default {
  name: 'App',
  data() {
    return {
      // 你要查谁的手机号
      name: '马超',
      currentPage:1
    }
  },
  components:{
     hello,pagination

  },
  created() {
    
  },
  methods: {
    changeHandler(v){
      this.currentPage = v
    },
    // 查询对应人物的手机号
    getPhone() {
      axios.get(`http://127.0.0.1:3000/userinfo`, {
        params: {
          name: this.name
        }
      })
      .then(data => {
        console.log(data)
      })
      .catch(error => {
        console.log(error)
      })
    }
  },
}
</script>

<style>
* {
  margin: 0;
  padding: 0;
}
#app {
  text-align: center;
}
</style>